import React from 'react'
import { NavBar, Icon, Drawer, List,Button} from 'antd-mobile';
import style from './index.less';
import PDFViewers from '../pdf-viewer/pdf-viewers';
import { connect } from 'dva';
import { _arrayBufferToBase64 } from '../../utils/utils';

@connect(({pdfModel }) => ({ pdfModel }))
class PDFListDrawer extends React.Component{
  constructor(props) {
    super(props)
    this.state = {
      pdfList:true,
    };
  }

  componentDidMount(){

  }

  closeDrawer =()=>{
    const {closeDrawer}=this.props;
    const data={ openDrawer:false,
      leftIcon:'flex'}
    if(closeDrawer){
      closeDrawer(data)
    }
  }
  getPdfId=(item)=>{
    const {getPdfId}=this.props
    if(getPdfId){
      getPdfId(item)
    }
  }
  render() {
  const {pdfList}=this.state;
  const {scale,sidebar}=this.props
    return (
      <div className={style.Drawer} style={{display:'flex'}}>
        <List className={style.pdfList}>
          {sidebar.map((item,index)=>{
            const arrPdf=[];
            arrPdf.push(item)
            return(<div className={style.pdfModel} key={index} onClick={this.getPdfId.bind(this,item)}>
             <div className={style.pdfTitle}><span>{item.name}</span></div>
             <List.Item className={style.pdfItem}>
            <PDFViewers docs={arrPdf} scale={scale} type={pdfList}/>
               </List.Item>
            </div>)
          })}
        </List>
        <div className={style.IconCenter}>
          <div onClick={this.closeDrawer} className={style.leftIcon}>
            <Icon type='left' color="white"/>
          </div>
        </div>

      </div>

    )
  }
}


export default PDFListDrawer;
